<script>
export default {
    props: {
        //单位：rem
        outerMargin: {
            type: Number,
            default: 0.75
        }
    },
    data() {
        return {
            itemBoxStyle: {},
            itemBoxMargin: "",
            itemBoxWidth: ""
        }
    },
    methods: {
        initStyle() {
            //paddindLeft-paddingRight: 20px;
            //
            let screenWidth = window.screen.width;//屏幕宽度
            let rem = window.getComputedStyle(document.querySelector("html"), null).fontSize.slice(0, -2) - 0;
            let outerMargin = this.outerMargin * rem;
            let itemBoxMarginRight = 0.5 * rem;
            let borderWidth = 2 + 2 * 3;
            let itemBoxWidth = parseInt((screenWidth - (itemBoxMarginRight * 3) - borderWidth - outerMargin * 2) / 3);
            this.itemBoxStyle = {
                width: itemBoxWidth + "px"
            }
            this.itemBoxWidth = this.itemBoxStyle.width;
        }
    },
    created() {
        this.initStyle();
    }

}
</script>
